//1. 引入Vue
import Vue from "vue";

//2. 引入VueRouter
import VueRouter from "vue-router";

//引入路由组件
import Login from "../pages/Login";
import Home from "../pages/Home";
import Music from "../pages/Home/Music";
import News from "../pages/Home/News";
import Games from "../pages/Home/Games";

//3. 让Vue使用VueRouter这个插件
Vue.use(VueRouter);

//4.创建路由器对象
export default new VueRouter({
  //在实例化路由器对象的配置中,书写路由表配置
  routes: [
    { path: "/login", component: Login },
    {
      path: "/home",
      component: Home,
      // name:"home",
      children: [
        //params动态参数：id ：time？ 可选参数  
        { path: "music/:id/:time?", component: Music, name: "music" },
        { path: "news", component: News, name: "news" },
        {
          path: "games",
          component: Games,
          name: "games",
          //设置props的值为布尔值 自动取拿值
          //  props:true
          //设置props的值为一个对象 可以将值代理在组件实例上
          // props: {
          //   a:1,
          //   b:2,
          //   c:3
          // }
          //设置props的值为一个函数 参数是$route对象
          props:(route)=>{
            return {...route.query}
          }
        },
        //默认路由1 指定跳转
        // {path:"/",redirect:"/home/news"}
        //默认路由2 匹配空串加载组件
        // {path:"",component: News}
      ]
    },
    { path: "/", redirect: "/login" }
  ],
});
